<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>MEGA 2.0</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<link rel="stylesheet" type="text/css" href="../css/style.css" />
<script type="text/javascript" src="../js/jquery-1.8.1.js"></script>
<script type="text/javascript" src="../js/jquery.jscrollpane.js"></script>
<script type="text/javascript" src="../js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="../js/jquery.mousewheel.js"></script>
<script type="text/javascript">
$(document).ready(function() {  


  $.gridRequestsHeader = function()  
  {	
		$('.contact-requests-grid .grid-table tr:first-child td').each(function(i,e) {
		  var headerColumn = $('.contact-requests-grid .grid-table-header th').get(i);
		  $(headerColumn).width($(e).width());
	    });
   }	
	
  
  $.gridRequestsHeader();
  
  $(window).bind('resize', function () 
  {
      $.gridRequestsHeader();
  });
  
  $('.fm-contact-requests').bind('click', function() {
	  $(this).addClass('hidden');
	  $('.fm-received-requests').removeClass('hidden');
	  $('.contact-requests-grid').addClass('hidden');
	  $('.sent-requests-grid').removeClass('hidden');
	  $('.fm-breadcrumbs.received-requests').addClass('hidden');
	  $('.fm-breadcrumbs.sent-requests').removeClass('hidden');
  });
  
  $('.fm-received-requests').bind('click', function() {
	  $(this).addClass('hidden');
	  $('.fm-contact-requests').removeClass('hidden');
	  $('.sent-requests-grid').addClass('hidden');
	  $('.contact-requests-grid').removeClass('hidden');
	  $('.fm-breadcrumbs.sent-requests').addClass('hidden');
	  $('.fm-breadcrumbs.received-requests').removeClass('hidden');
  });
	
  
});

</script>
</head>

<body id="bodyel">


<div id="fmholder" class="fmholder" style="display: block;">
          <div class="top-head">
           
          </div>
          <div class="fm-main default">
              <div class="nw-fm-left-icons-panel">
                 <div class="nw-fm-left-icon cloud-drive">
                   <div class="nw-fm-left-tooltip">Cloud Drive</div>
                 </div>
                 <div class="nw-fm-left-icon shared-with-me">
                   <div class="nw-fm-left-tooltip">Shared with me</div>
                 </div>
                 <div class="nw-fm-left-icon contacts active">
                   <div class="nw-fm-left-tooltip">Contacts</div>
                 </div>
                 <div class="nw-fm-left-icon conversations">
                   <div class="nw-fm-left-tooltip">Conversations</div>
                 </div>
                 <div class="nw-fm-left-icon rubbish-bin filled"><div class="nw-fm-left-tooltip">Rubbish bin</div><div class="rubbish-bin-icon"></div></div>
              </div>
          
              <div class="fm-left-panel">
                <div class="fm-left-menu user-management">
                   <div class="nw-fm-tree-header contacts">
                       <input type="text" value="Contacts" placeholder="Contacts">
                       <div class="nw-fm-search-icon"></div>
                   </div>
                </div>
                <div class="fm-tree-panel">
                  <div class="nw-tree-panel-header">
                     <span>My contacts</span>
                     <div class="nw-tree-panel-arrows"></div>
                  </div>
                  <div class="content-panel contacts active">
                    <div class="nw-contact-item offline">
                      <div class="nw-contact-status"></div>
                      <div class="nw-contact-name">Andrei.Dymovich@conmio.com</div>
                    </div>
                    <div class="nw-contact-item busy">
                      <div class="nw-contact-status"></div>
                      <div class="nw-contact-name">Bram van der Kolk</div>
                    </div>
                    <div class="nw-contact-item away">
                      <div class="nw-contact-status"></div>
                      <div class="nw-contact-name">Eduardo</div>
                    </div>
                    <div class="nw-contact-item online">
                      <div class="nw-contact-status"></div>
                      <div class="nw-contact-name">Zeus</div>
                    </div>
                  </div>
                </div>
              
              </div>
              <div class="fm-right-files-block">
              
                <div class="fm-right-header">
                
                   <div class="fm-breadcrumbs-block">
                     <!-- Please replace "cloud-drive" on "contacts" !-->
                     <a class="fm-breadcrumbs contacts contains-directories has-next-button">
                       <span class="right-arrow-bg"><span></span></span>
                     </a>
                     <!-- Please replace "folder" on "received-requests"/"sent-requests" !-->
                     <a class="fm-breadcrumbs received-requests contains-directories">
                         <span class="right-arrow-bg ui-draggable"><span>Received Requests</span></span>
                     </a>
                     <a class="fm-breadcrumbs sent-requests contains-directories hidden">
                         <span class="right-arrow-bg ui-draggable"><span>Sent Requests</span></span>
                     </a>
                     <div class="clear"></div>
                   </div>
                   
                   <!-- New buttons !-->
                   <div class="fm-contact-requests">
                       <span>View sent requests</span>
                   </div>
                   
                   <div class="fm-received-requests hidden">
                        <span>View received requests</span>
                   </div>
                   
                   <div class="fm-add-user">
                       <div class="add-user-popup-arrow"></div>
                       <span>Add contact</span>
                   </div>
                   
                   <!-- Please hide grid/blocks view buttons !-->
                   <a class="fm-files-view-icon block-view" style="display:none;"></a>
                   <a class="fm-files-view-icon listing-view" style="display:none;"></a>
                   <div class="clear"></div>
                </div>
 
<!-- Empty block for contact requests !-->                
<div class="empty-contact-requests hidden">
 <div class="empty-requests-pad">
   <div class="fm-empty-cloud-txt">No new contact requests</div>
   <div class="empty-contact-requests-button"> View sent requests</div>
 </div>
</div>

<!-- Empty block for sent requests !--> 
<div class="empty-sent-requests hidden">
 <div class="empty-requests-pad">
   <div class="fm-empty-cloud-txt">No sent requests</div>
   <div class="empty-sent-requests-button"> View received requests</div>
 </div>
</div>

<!-- Contact requests grid !-->
<div class="contact-requests-grid">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="grid-table-header contact-requests">
  <tr>
	<th><div class="name arrow desc">Name</div></th>
	<th><div class="content arrow">Content</div></th>
	<th></th>
  </tr>
</table>
<!-- Init scrolling pls !--> 
<div class="grid-scrolling-table">
  <table width="100%" border="0" cellspacing="0" cellpadding="0" class="grid-table contact-requests">
    <!-- Please add "deleted" or "ignored" classnames for necessary cases !-->
    <tr class="deleted">
      <td>
        <div class="nw-contact-avatar color0">AD</div>
        <div class="fm-chat-user-info">
          <div class="fm-chat-user">Andrei Dymovich</div>
          <div class="contact-email">ad@mega.co.nz</div>
        </div>
      </td>
	  <td><span class="contact-request-content">2 pending shared folders</span></td>
	  <td>
        <div class="contact-request-button delete">Delete</div>
        <div class="contact-request-button accept">Accept</div>
        <div class="contact-request-button ignore">Ignore further requests</div>
        <div class="contact-request-ignored">User ignored</div>
        <div class="clear"></div>
      </td>
    </tr>
    <!-- Please add "deleted" or "ignored" classnames for necessary cases !-->
    <tr>
      <td>
        <div class="nw-contact-avatar color0">AD</div>
        <div class="fm-chat-user-info">
          <div class="fm-chat-user">Andrei Dymovich</div>
          <div class="contact-email">ad@mega.co.nz</div>
        </div>
      </td>
	  <td><span class="contact-request-content">2 pending shared folders</span></td>
	  <td>
        <div class="contact-request-button delete">Delete</div>
        <div class="contact-request-button accept">Accept</div>
        <div class="contact-request-button ignore">Ignore further requests</div>
        <div class="contact-request-ignored">User ignored</div>
        <div class="clear"></div>
      </td>
    </tr>
    <!-- Please add "deleted" or "ignored" classnames for necessary cases !-->
    <tr class="ignored">
      <td>
        <div class="nw-contact-avatar color0">AD</div>
        <div class="fm-chat-user-info">
          <div class="fm-chat-user">Andrei Dymovich</div>
          <div class="contact-email">ad@mega.co.nz</div>
        </div>
      </td>
	  <td><span class="contact-request-content">2 pending shared folders</span></td>
	  <td>
        <div class="contact-request-button delete">Delete</div>
        <div class="contact-request-button accept">Accept</div>
        <div class="contact-request-button ignore">Ignore further requests</div>
        <div class="contact-request-ignored">User ignored</div>
        <div class="clear"></div>
      </td>
    </tr>
    <!-- Please add "deleted" or "ignored" classnames for necessary cases !-->
    <tr>
      <td>
        <div class="nw-contact-avatar color0">AD</div>
        <div class="fm-chat-user-info">
          <div class="fm-chat-user">Andrei Dymovich</div>
          <div class="contact-email">ad@mega.co.nz</div>
        </div>
      </td>
	  <td><span class="contact-request-content"></span></td>
	  <td>
        <div class="contact-request-button delete">Delete</div>
        <div class="contact-request-button accept">Accept</div>
        <div class="contact-request-button ignore">Ignore further requests</div>
        <div class="contact-request-ignored">User ignored</div>
        <div class="clear"></div>
      </td>
    </tr>
    <!-- Please add "deleted" or "ignored" classnames for necessary cases !-->
    <tr>
      <td>
        <div class="nw-contact-avatar color0">AD</div>
        <div class="fm-chat-user-info">
          <div class="fm-chat-user">Andrei Dymovich</div>
          <div class="contact-email">ad@mega.co.nz</div>
        </div>
      </td>
	  <td><span class="contact-request-content"></span></td>
	  <td>
        <div class="contact-request-button delete">Delete</div>
        <div class="contact-request-button accept">Accept</div>
        <div class="contact-request-button ignore">Ignore further requests</div>
        <div class="contact-request-ignored">User ignored</div>
        <div class="clear"></div>
      </td>
    </tr>
  </table>
</div>
</div>
 
<!-- Sent requests grid !--> 
<div class="sent-requests-grid hidden">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="grid-table-header sent-requests">
  <tr>
	<th><div class="name arrow desc">Name</div></th>
  </tr>
</table>
<!-- Init scrolling pls !--> 
<div class="grid-scrolling-table">
  <table width="100%" border="0" cellspacing="0" cellpadding="0" class="grid-table sent-requests">
    <tr>
      <td>
       <div class="left email">
         <div class="nw-contact-avatar"></div>
         <div class="fm-chat-user-info">
           <div class="contact-email">ad@mega.co.nz</div>
         </div>
       </div>
       <div class="contact-request-button cancel">Cancel Request</div>
       <div class="contact-request-button reinvite">Reinvite</div>
       <div class="clear"></div>
      </td>
    </tr>
    <tr>
      <td>
       <div class="left email">
         <div class="nw-contact-avatar"></div>
         <div class="fm-chat-user-info">
           <div class="contact-email">ad@mega.co.nz</div>
         </div>
       </div>
       <div class="contact-request-button cancel">Cancel Request</div>
       <div class="contact-request-button reinvite">Reinvite</div>
       <div class="clear"></div>
      </td>
    </tr>
    <tr>
      <td>
       <div class="left email">
         <div class="nw-contact-avatar"></div>
         <div class="fm-chat-user-info">
           <div class="contact-email">ad@mega.co.nz</div>
         </div>
       </div>
       <div class="contact-request-button cancel">Cancel Request</div>
       <div class="contact-request-button reinvite">Reinvite</div>
       <div class="clear"></div>
      </td>
    </tr>
  </table>
</div>
</div>                
                
              
              </div>
              <div class="clear"></div>
           
          </div>
          
<div class="transfer-panel">
  <div class="transfer-icons-block">
   <div class="transfer-drag-handle ui-resizable-handle ui-resizable-n"></div>
   <div class="file-transfer-icon download-percents-50  upload-percents-49">
     <div class="file-transfer-download">
        <div class="file-transfer-upload"></div> 
     </div> 
   </div>
   <div class="transfer-panel-title">
         File transfers
   </div>
   <a class="tranfer-view-icon active"></a>
   <a class="transfer-settings-icon"></a>
   <div class="tranfer-upload-indicator active">
        640 Kb/s
   </div>
   <div class="tranfer-download-indicator active">
        1640 Kb/s
   </div>
   <a class="transfer-pause-icon active"></a>
   <div class="clear"></div>
 </div>
</div>


</div>


</body>
</html>
